$(function(){
  var ClipDoll = {
    data:{
      count: 0,      // 数量
      speed: 25,      // 移动速度
      step: 2,      // 移动步长
      margin: 50,     // 外边距
      num: 2,         // 剩余次数
      isplay: true,   // 开始按钮是否可操作
      timer:null,     // 移动定时器
      posterWidth:0,  // 总共的宽度
      totalWidth:0,   // 总宽度
      itemWidth:0,    // 单个宽度
      showListW:0,    // 展示列宽度
      countArray:[],  // 个数数组
      itemArray:null, // 子元素数组
      itemArray2:null,// 后子元素数组
      itemLeft:[],    // 子元素的左定位
      itemLeft2:[],   // 后子元素的左定位
      itemLeftMax: null,
      itemLeftMin: null,
      isleft: false,
      timeout:false,  // 判断是否轮播
      catched:false,  // 是否夹到
      result:null     // 结果
    },
    init: function(){ // 初始化
      ClipDoll.data.count = $(".poster-list li").length;
      $(".today-nums em").text(ClipDoll.data.num); // 剩余次数展示
      for(var i=0;i<ClipDoll.data.count;i++){ // 奖品列表
        ClipDoll.data.countArray.push(i)
      }
      for(var i=ClipDoll.data.count-1;i>=0;i--){
        var prizeList = $(".poster-list li").eq(i).html();
        var showList = $(".poster-list li .prize-img").eq(i).html();
        $('.poster-list2').append("<li>"+prizeList+"</li>");
      }

      ClipDoll.data.totalWidth = parseFloat($('.poster-item').css("width"));// 总宽度
      ClipDoll.data.itemWidth = parseFloat($('.poster-item li').css("width"));// 单个宽度
      ClipDoll.data.posterWidth = ClipDoll.data.itemWidth + ClipDoll.data.margin;// 单个宽度 + 外边距
      ClipDoll.data.itemArray = $('.poster-list li');// 子元素数组
      ClipDoll.data.itemArray2 = $('.poster-list2 li');// 子元素数组
      function mess(arr){
        var _floor = Math.floor, _random = Math.random,
          len = arr.length, i, j, arri,
          n = _floor(len/2)+1;
        while( n-- ){
          i = _floor(_random()*len);
          j = _floor(_random()*len);
          if( i!==j ){
            arri = arr[i];
            arr[i] = arr[j];
            arr[j] = arri;
          }
        }
        return arr;
      }
      // 子元素重新排序
      mess(ClipDoll.data.countArray);
      for(var i = 0;i< ClipDoll.data.countArray.length;i++){
        var item = $('.poster-list li')[i];
        var item2 = $('.poster-list2 li')[i];
        // 子元素偏移
        $(item).css({
          'transform':'translateX('+ClipDoll.data.posterWidth*ClipDoll.data.countArray[i]+'px)',
          '-webkit-transform':'translateX('+ClipDoll.data.posterWidth*ClipDoll.data.countArray[i]+'px)'
        });
        $(item2).css({
          'transform':'translateX('+(-ClipDoll.data.posterWidth*ClipDoll.data.countArray[i])+'px)',
          '-webkit-transform':'translateX('+(-ClipDoll.data.posterWidth*ClipDoll.data.countArray[i])+'px)'
        });
        // 子元素对应的左定位
        ClipDoll.data.itemLeft.push(ClipDoll.data.posterWidth*ClipDoll.data.countArray[i]);
        ClipDoll.data.itemLeft2.push(-ClipDoll.data.posterWidth*ClipDoll.data.countArray[i]);
        ClipDoll.data.itemLeftMax = Math.max.apply(null, ClipDoll.data.itemLeft)
        ClipDoll.data.itemLeftMin = Math.min.apply(null, ClipDoll.data.itemLeft2)
      }
      ClipDoll.move();
      ClipDoll.control();
    },
    move: function(){// 移动
      function time(){
        // 轮播
        if(ClipDoll.data.timeout) return;
        Method();
        ClipDoll.data.timer = setTimeout(time,ClipDoll.data.speed);
      }
      function Method(){
        var beforeStep= ClipDoll.data.step; //移动步长
        var afterStep = ClipDoll.data.step;
        if (ClipDoll.data.isleft) {
          /*前排奖品轮播*/
          for(var i=0;i<ClipDoll.data.itemArray.length;i++){// 遍历子元素数组
            if( ClipDoll.data.itemLeft[i]<=-ClipDoll.data.posterWidth){
              $(ClipDoll.data.itemArray[i]).css({
                'transform':'translateX('+(Math.max.apply(null, ClipDoll.data.itemLeft)+ClipDoll.data.posterWidth-beforeStep)+'px)',
                '-webkit-transform':'translateX('+(Math.max.apply(null, ClipDoll.data.itemLeft)+ClipDoll.data.posterWidth-beforeStep)+'px)'
              })
              ClipDoll.data.itemLeft[i] = Math.max.apply(null, ClipDoll.data.itemLeft)+ClipDoll.data.posterWidth-beforeStep;
            } else {
              $(ClipDoll.data.itemArray[i]).css({
                'transform':'translateX('+(ClipDoll.data.itemLeft[i]-beforeStep)+'px)',
                '-webkit-transform':'translateX('+(ClipDoll.data.itemLeft[i]-beforeStep)+'px)'
              })
              ClipDoll.data.itemLeft[i] = ClipDoll.data.itemLeft[i]-beforeStep;
            }
          }
          /*后排奖品轮播*/
          for(var i=0;i<ClipDoll.data.itemArray2.length;i++){
            if(ClipDoll.data.itemLeft2[i]>=ClipDoll.data.posterWidth){
              $(ClipDoll.data.itemArray2[i]).css({
                'transform':'translateX('+(Math.min.apply(null, ClipDoll.data.itemLeft2) + afterStep)+'px)',
                '-webkit-transform':'translateX('+(Math.min.apply(null, ClipDoll.data.itemLeft2) + afterStep)+'px)'
              });
              ClipDoll.data.itemLeft2[i] = Math.min.apply(null, ClipDoll.data.itemLeft2) - ClipDoll.data.posterWidth + afterStep;
            } else {
              $(ClipDoll.data.itemArray2[i]).css({
                'transform':'translateX('+(ClipDoll.data.itemLeft2[i]+afterStep)+'px)',
                '-webkit-transform':'translateX('+(ClipDoll.data.itemLeft2[i]+afterStep)+'px)'
              });
              ClipDoll.data.itemLeft2[i] = ClipDoll.data.itemLeft2[i]+afterStep;
            }
          }
        } else {
          /*前排奖品轮播*/
          for(var i=0;i<ClipDoll.data.itemArray.length;i++){// 遍历子元素数组
            if( ClipDoll.data.itemLeft[i] <= ClipDoll.data.itemLeftMax){
              $(ClipDoll.data.itemArray[i]).css({
                'transform':'translateX('+(ClipDoll.data.itemLeft[i]+beforeStep)+'px)',
                '-webkit-transform':'translateX('+(ClipDoll.data.itemLeft[i]+beforeStep)+'px)'
              })
              ClipDoll.data.itemLeft[i] = ClipDoll.data.itemLeft[i]+beforeStep;
            } else {
              $(ClipDoll.data.itemArray[i]).css({
                'transform':'translateX('-ClipDoll.data.posterWidth +'px)',
                '-webkit-transform':'translateX('-ClipDoll.data.posterWidth +'px)'
              })
              ClipDoll.data.itemLeft[i] = -ClipDoll.data.posterWidth
            }
          }
          for(var i=0;i<ClipDoll.data.itemArray2.length;i++){
            if(ClipDoll.data.itemLeft2[i]>=ClipDoll.data.itemLeftMin) {
              $(ClipDoll.data.itemArray2[i]).css({
                'transform':'translateX('+(ClipDoll.data.itemLeft2[i]-afterStep)+'px)',
                '-webkit-transform':'translateX('+(ClipDoll.data.itemLeft2[i]-afterStep)+'px)'
              });
              ClipDoll.data.itemLeft2[i] = ClipDoll.data.itemLeft2[i]-afterStep;
            } else {
              $(ClipDoll.data.itemArray2[i]).css({
                'transform':'translateX(' + (ClipDoll.data.posterWidth) +'px)',
                '-webkit-transform':'translateX(' + (ClipDoll.data.posterWidth) +'px)'
              })
              ClipDoll.data.itemLeft2[i] = ClipDoll.data.posterWidth
            }
          }
        }
      }
      time();
    },
    play: function(){//夹取
      ClipDoll.data.timeout = true;           // 停止轮播
      clearTimeout(ClipDoll.data.timer);      // 清除定时器
      ClipDoll.data.timer = null;
      var zleft = parseFloat($('.clip').css('left'));   // 夹子左定位
      var zwidth = parseFloat($('.clip').css('width')); // 夹子宽度

      // 判断是否夹到
      for(var i=0;i<ClipDoll.data.itemLeft.length;i++){// 遍历每一个子元素的左定位
        var left = ClipDoll.data.itemLeft[i];
        if(
          (left+0.2*zwidth)<=zleft &&
          zleft<=(left+ClipDoll.data.itemWidth-0.2*zwidth)
        ){
          //夹到娃娃动画
          ClipDoll.data.catched = true; // 是否夹到
          ClipDoll.data.result = i;  // 结果
          console.log(i)
        }
      }

      $(".footer div").removeClass("move").addClass("zhua");
      setTimeout(function(){
        $('.clip').addClass('clipdown'); // 夹子向下移动动画
      },500);
      var c = setTimeout(function(){

        $(".footer div").removeClass("zhua").addClass("zhua2");
        /*判断是否夹到*/
        if(ClipDoll.data.catched){
          var t1 = setTimeout(function(){
            console.log($('.poster-list .prize'+(ClipDoll.data.result)))
            $('.clip').removeClass('clipdown').addClass('cliphalfup'); // 夹子向上移动动画
            $('.poster-list .prize'+(ClipDoll.data.result)).hide().addClass('img-slidehalfUp');
            $(".prize-result").html("").append( $('.poster-list .prize'+(ClipDoll.data.result)).html()).show();
            var t2 = setTimeout(function(){
              $('.clip').removeClass('cliphalfup').addClass('clipup'); // 夹子向上移动动画
              var random = Math.random()*15; // 概率控制
              if(random <= 10){
                $('.poster-list .prize'+(ClipDoll.data.result)).removeClass("img-slidehalfUp").addClass('img-slideUp'); // 对应奖品上移
                var t3 = setTimeout(function(){
                  $('.clip').removeClass('clipup').addClass('clipOutUp'); // 向上夹
                  var prize = $('.poster-list .prize'+(ClipDoll.data.result));
                  prize.addClass('img-slideOutUp');
                  // 次数减1
                  ClipDoll.data.num -= 1;
                  $(".today-nums em").text(ClipDoll.data.num);
                  // 弹窗
                  $(".popup").show();
                  $(".suc-bg").show();
                  $(".suc-tip").show().text(prize);
                  // 关闭弹窗重新开夹
                  $('.popup .pop-close').click(function(){
                    $('.clip').removeClass('clipdown').removeClass('clipup').removeClass('clipOutUp');
                    $(".footer div").addClass("move").removeClass("zhua").removeClass("zhua2");
                    ClipDoll.data.isplay = true;
                    ClipDoll.start();
                  });
                  clearTimeout(t3);
                  t3 = null;
                },1500);
              }else{
                $(".prize-result").hide();
                $('.poster-list .prize'+(ClipDoll.data.result)).show().removeClass("img-slidehalfUp").addClass('img-slideDown'); // 对应奖品下落
                // 弹出没夹到提示
                var t3 = setTimeout(function(){
                  // 次数减1
                  ClipDoll.data.num -= 1;
                  $(".today-nums em").text(ClipDoll.data.num);
                  // 弹窗
                  $('.popup').show();
                  $(".failed-bg").show();
                  $(".failed-tip").show();
                  // 关闭弹窗重新开夹
                  $('.popup .pop-close').click(function(){
                    $('.clip').removeClass('clipdown').removeClass('clipup').removeClass('clipOutUp');
                    $(".footer div").addClass("move").removeClass("zhua").removeClass("zhua2");
                    ClipDoll.data.isplay = true;
                    ClipDoll.start();
                  });
                  clearTimeout(t3);
                  t3 = null;
                },1500);
              }
              clearTimeout(t2);
              t2 = null;
            },600);
          clearTimeout(t1);
          t1 = null;
        },1300);
        }else{
          var t1 = setTimeout(function(){
            $('.clip').removeClass('clipdown').addClass('cliphalfup'); // 夹子向上移动动画
            var t2 = setTimeout(function(){
              $('.clip').removeClass('cliphalfup').addClass('clipup'); // 夹子向上移动动画
              // 弹出没夹到提示
              var t3 = setTimeout(function(){
                  // 次数减1
                  ClipDoll.data.num -= 1;
                  $(".today-nums em").text(ClipDoll.data.num);
                  // 弹窗
                  $('.popup').show();
                  $(".failed-bg").show();
                  $(".failed-tip").show();
                  // 关闭弹窗重新开夹
                  $('.popup .pop-close').click(function(){
                    $('.clip').removeClass('clipdown').removeClass('clipup').removeClass('clipOutUp');
                    $(".footer div").addClass("move").removeClass("zhua").removeClass("zhua2");
                    ClipDoll.data.isplay = true;
                    ClipDoll.start();
                  });
                  clearTimeout(t3);
                  t3 = null;
                },1500);
                clearTimeout(t2);
                t2 = null;
              },600);
            clearTimeout(t1);
            t1 = null;
          },1300);
        }
        clearTimeout(c);
        c = null;
      },1500)
    },
    start: function(){ // 开始
      if(ClipDoll.data.timer==null){
        $(".prize-result").hide();
        $('.popup').hide(); // 失败窗口隐藏
        $('.clip').removeClass('clipdown').removeClass('cliphalfup').removeClass('clipOutUp'); // 删除动画
        $(".footer div").addClass("move").removeClass("zhua").removeClass("zhua2");
        $('.prize'+(ClipDoll.data.result)).show().removeClass('img-slidehalfUp').removeClass('img-slideUp').removeClass('img-slideOutUp');
        ClipDoll.data.catched = false;
        ClipDoll.data.result = null;
        ClipDoll.data.timeout = false;
        ClipDoll.move();
      }
    },
    control: function(){//控制
      // 开始游戏
      $(".start-btn").on("click",function(){
        if(ClipDoll.data.num>0){
          if(ClipDoll.data.isplay){
            ClipDoll.data.isplay = false;
            ClipDoll.play()
          }
        }else{
          // 弹窗
          $(".popup").show();
          $(".failed-bg").show();
          $(".num-tip").show();
        }
      });
      // 夹子向左
      $(".left-btn").on("touchstart",function(){
        ClipDoll.data.isleft = true
        var zleft = parseFloat($('.clip').css('left'));
        var zwidth = parseFloat($('.clip').css('width'));
        if(zleft>zwidth/2){
          if(zleft - 50>0){
            zleft -= 50;
          }else {
            zleft = 0;
          }
          $(".clip").css("left",zleft)
        }
      });
      // 夹子向右
      $(".right-btn").on("touchstart",function(){
        ClipDoll.data.isleft = false
        var zleft = parseFloat($(".clip").css('left'));
        var zwidth = parseFloat($(".clip").css('width'));
        if(zleft<ClipDoll.data.totalWidth){
          if(zleft + 50 < ClipDoll.data.totalWidth - zwidth/2){
            zleft += 50;
          }else{
            zleft = ClipDoll.data.totalWidth - zwidth/2;
          }
          $(".clip").css("left",zleft)
        }
      });
      // 活动规则
      $(".rules-btn").on("click",function(){
        $(".popup").show();
        $(".rule-bg").show();
        $(".rule-tip").show();
      });
      // 关闭弹窗
      $(".pop-close").on("click",function(){
        $(".popup").hide();
        $(".popup-bg").hide();
        $(".popup-tip").hide();
      })
    }
  };
  // 初始化
  ClipDoll.init();
});

